vue-cli中vuex IE兼容
vue2.0 兼容ie9及其以上vue-cli中使用vuex的项目 在IE中会出现页面空白 控制台报错的情况:我们只需要安装一个插件，然后在main.js中全局引入即可安装 npm install --save-dev -polyfill引入 import 'babel-polyfill'...
2024-01-10
vue-cli 运行打开浏览器
在配置好项目之后的package.json文件中，找到运行的script，其中“serve”中增加配置“ --open”"scripts": { "serve": "vue-cli-service serve --open", "build": "vue-cli-service build", "lint": "vue-cli-service lint" }, 默认打开系统默认浏览器...
2024-01-10
vue中的v-cloak
问题在使用vue时，HTML 绑定 Vue实例，在页面加载时会闪烁类似{{msg}}这样的信息。可能会导致用户体验不好。使用v-cloakv-cloak就能解决这个问题。(1)用法这个指令保持在元素上直到关联实例结束编译。和 CSS 规则如 [v-cloak] { display: none } 一起用时，这个指令可以隐藏未编译的 Mustache 标签直到实例准备...
2024-01-10
vue-cli 首屏加载优化问题
使用 vue-cli构建的项目,在 默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体,打包位置是 dist/static/js/app.[contenthash].js 类似下面的路由代码router/index.js 路由相关信息,该路由文件引入了多个 .vue组件import Personal from '@/components/page/Personal'import Message from '@/components/personnal/Message'imp...
2024-01-10
vue中v- if未生效？
自写的组件，通过是否有ID注册来显示，第一次进来为null，因为没有注册。注册成功后请求数据赋值，但是组件并没有显示，求各位大佬帮帮忙回答：那肯定判断条件补符合吧回答：没显示应该就是if里的表达式为false，你可以把res.code和res.data打印出来看看，可能code不是200，也可能返回的res.data是空的回答：showAuntId必须在data中定义，否则不是响应式的。...
2024-02-08
vue cli4.0 配置环境变量
温馨提示：本文只适用于vue-cli 3.0 及以上的版本哦~------------------正文开始------------------开发项目时，经常会需要在不同环境中切换。那么我们如何配置不同的环境变量呢？为了更加方便消化本文章，建议先看下官方文档：环境变量和模式看完官方的文档如果还没有明白，可以参考本文。在vue-cli ...
2024-01-10
vue-cli 出现导航重复解决方法
在你的路由文件里加上即可const originalPush = Router.prototype.pushRouter.prototype.push = function push(location) {return originalPush.call(this, location).catch(err => err)} ...
2024-01-10
@vue/cli 4.0.5 学习记录
1. Vue CLI (@vue/cli) 是一个全局安装的 npm 包，提供了终端里的 vue 命令。Vue CLI 插件的名字以 @vue/cli-plugin- (内建插件) 或 vue-cli-plugin- (社区插件) 开头，非常容易使用，如@vue/cli-plugin-babel.安装vue-clinpm install -g @vue/cli# ORyarn global add @vue/cli你还可以用这个命令来检查其版本是否正确：vue --version如果...
2024-01-10
diff 算法 -vue
1. 前言diff 算法是一种通过同层的树节点进行比较的高效算法，避免了对树进行逐层搜索遍历，所以时间复杂度只有 O(n)。diff 算法的在很多场景下都有应用，例如在 vue 虚拟 dom 渲染成真实 dom 的新旧 VNode 节点比较更新时，就用到了该算法。diff 算法有两个比较显著的特点：比较只会在同层级进行, 不...
2024-01-10
vue v-on:click传递动态参数的步骤
最近项目中要为一个循环列表动态传送当前点击列的数据，查了很久资料也没有一个完美的解决方案，新手只能用vue的事件处理器与jquery的选择器做了一个不伦不类的方案，居然也能解决这个问题，作此记录留待以后会有更好的方法解决这个事情需求：根据每列传递的参数，决定弹窗后面是积分够了...
2024-01-10
vue-cli3项目升级到vue-cli4 的方法总结
这是我对以前配置的基于vue-cli3搭建的前端H5模板的升级，主要把vue-cli3项目升级为vue-cli4，并删除一些过时插件。插件版本升级到当前(2020-03-19)最高版本（升级了很多webpack插件版本），升级完后新加多域名代理配置，官方升级文档点我点我按着官方的文档升级来也会碰到很多坑，????，配置完可直接使...
2024-01-10
Vue入门——环境的搭建 vue-cli
安装vue-clicnpm install -g @vue/cli创建vue项目 vue create hello-world打开项目，运行工程 cd hello-world npm run serve （cnpm run serve）打开网页http://localhost:8080/启动vue ui 创建vue ui创建完成后，可以看到自己配置的插件运行...
2024-01-10Vue.js v-if / v-else
示例假设我们有一个Vue.js实例定义为：var vm = new Vue({ el: '#example', data: { a: true, b: false }});您可以通过包含v-if指令有条件地呈现任何html元素；包含v-if的元素仅在条件评估为true时才会呈现：<!-- will render 'The condition is true' into the DOM --><div id="example">...
2024-01-10@vue/cli 4.5如何移除指定插件？
更新：最终结果是该插件有依赖关系，想要删除html插件，需要连续删除多个，下面列出config.plugins.delete('preload');config.plugins.delete('prefetch');config.plugins.delete('html');分割线---------------------------------------------------------...
2024-02-24
解决vue-cli输入命令vue ui没效果的问题
最近用vue-cli脚手架很顺口，特别是UI控制台，在这里，创建项目和搭建本地环境，连接服务端变得很容易，页面ui也是一流要怎么启动呢？在终端输入命令行vue ui，启动UI控制台，然后往浏览器输入终端报出的链接输入命令行vue ui，终端会报启动信息，这本来很正常。可是呢，今天不知道啥回事，输...
2024-01-10
【Vue】vue-cli 配置跨域代理不生效
proxyTable: {'/api':{target:'http://www.api.com/api',changeOrigin:true,pathRewrite:{'^/api':''}}},在config/index.js里配置里这个代理，页面发请求依然是请求到本地的。要怎么正确配置呢？发的请求代码如下this.$http.get('/api/menu/get_list').then(function(data){console.log(data)})这样子发的请求仍然是http://localhos...
2024-01-10
(笔记整理）vue-cli 脚手架及打包（6）
vue-cli是一个官方发布 vue.js 项目脚手架，使用 vue-cli 可以快速创建 vue 项目，GitHub地址是：https://github.com/vuejs/vue-cli一、安装vue-cli： 直接全局安装 vue-cli： npm install -g vue-cli但是这种安装方式比较慢，推荐使用国内镜像来安装，所以我们先设置 cnpm：npm install -g cnpm --registry=https://registry.npm.taobao.org ...
2024-01-10
vue 添加 fastclick的支持
fastclick：处理移动端click事件300毫秒延迟1、兼容性iOS 3及更高版本的移动SafariiOS 5及更高版本的ChromeAndroid上的Chrome（ICS）Opera Mobile 11.5及以上版本Android 2以来的Android浏览器PlayBook OS 1及以上版本2、安装npm install fastclick -S之后，在main.js中引入，并绑定到bodyimport FastClick from 'fastclick'FastClick.attach(doc...
2024-01-10
vue-cli3升级到vue/cli4后，刷新页面特别慢
项目是基于vue-cli3创建的，时间比较久了，稍微修改一点内容，编译就需要花特别长时间，项目升级到vue/cli4试试，项目移植完成后，问题的确解决了，修改一点东西后，编译速度很快。但是又有另外的问题了：刷新页面的时候发现加载速度特别特别慢，估计要10s多才能加载完成，然后f12看了一下请求...
2024-01-10
vue v-for src 图片路径问题 404
我的代码结构如下所示不能执行，会出现报错<RadioGroup v-model="animal"> <Radio v-for='a in radio_arr' label={{a}}></Radio></RadioGroup>export default { data(){ return{ radio_arr:['循环1','循环2','循环3'], animal:'循环2' } }} 报错信息： 修改代码如下： 修改内容为...
2024-01-10
解决vue v-if 不重新渲染组件问题
问题描述：tab切换，发现v-if 并没有销毁掉组件原因：可能原因是Vue识别到是相似组件（高度相似甚至相同）不会更新元素。解决办法：给俩个高度相似的组件分别加上不同的key值让Vue识别为不同的组件。...
2024-01-10
浅谈vue-cli 3 和 vue-cli 2的区别！！！
Vue-cli3.0于8.11日正式发布，看了下评论，不是特别的乐观，说说我个人的意见，我是Vue的忠实粉，so....大概三个月前超哥就已经得知3.0的消息，试着用了下，相比之下现在的3.0和测试时的区别：modern mode。启用该模式会自动构建两个版本的 js 包，针对支持现代浏览器的原生 ES2015+ 包，和针对其他旧浏...
2024-01-10
VUE : vue-cli中去掉路由中的井号#操作
vue-cli项目中，如果想去掉url地址栏中的“#”我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面。只需要在路由表中，加入一行代码即可。补充知识：vue 打包部署去掉#注意事项示例基于vue cli2.0脚手架生成的项目1.vue项目中config文件下index.js中打...
2024-01-10
解决vue v-for src 图片路径问题 404
我的代码结构如下所示不能执行，会出现报错<RadioGroup v-model="animal"> <Radio v-for='a in radio_arr' label={{a}}></Radio></RadioGroup>export default { data(){ return{ radio_arr:['循环1','循环2','循环3'], animal:'循环2' } }} 报错信息：修改代码如下： 修改内容为 label={{a}} 修改为 ：label='a'...
2024-01-10
从vue-cli3升级到vite3, 怎么配置loader ?
回答：单纯看是没有配置好对应文件的 loader，比如说你在 js 文件中使用了 jsx 就需要在 loader 配置里面加上 jsx 项。例如修改 vite.config.js// vite.config.jsexport default defineConfig({ // .... plugins: [createVuePlugin({ jsx: true })]})或者在当前页...
2024-02-29
